﻿@using YiSha.Model.Param.OrganizationManage
@{
    Layout = "~/Views/Shared/_FormGray.cshtml";

    ShowUserData ShowUserData = ViewBag.ShowData;
}
@inject Microsoft.AspNetCore.Hosting.IWebHostEnvironment HostingEnvironment
@section header{
    @BundlerHelper.Render(HostingEnvironment.ContentRootPath, Url.Content("~/lib/report/echarts/echarts.min.js"))
}

<div class="wrapper wrapper-content">

    <div class="row">
        <div class="col-sm-12">

            <div class="ibox float-e-margins">
                <div class="ibox-title">
                    <h3>推广信息</h3>
                </div>
                <div class="ibox-content">
                    <div class="row">
                        <div class="col-sm-12">
                            <table class="table table-hover margin bottom">
                                <tbody>
                                    <tr>
                                        <td>
                                            <button class="btn btn-primary dim" type="button">
                                                <i class="fa fa-money"></i>
                                            </button>账户金额
                                        </td>
                                        <td><span style="color:#28dd46;">@ShowUserData.Money</span></td>
                                        <td>
                                            <button class="btn btn-warning dim" type="button">
                                                <i class="fa fa-check-square" aria-hidden="true"></i>
                                            </button>消耗金额
                                        </td>
                                        <td><span style="color:#ab247a;">@ShowUserData.TotalConsume</span></td>
                                        <td>
                                            <button class="btn btn-success  dim" type="button">
                                                <i class="fa fa-upload"></i>
                                            </button>今日消耗
                                        </td>
                                        <td>
                                            <span style="color:#7266ba;">@ShowUserData.TodayConsume</span>
                                        </td>
                                    </tr>
                                    <tr>

                                        <td>
                                            <button class="btn btn-danger  dim " type="button">
                                                <i class="fa fa-heart"></i>
                                            </button>总点击量
                                        </td>
                                        <td><span style="color:#ea17dc;">@ShowUserData.TotalClick</span></td>
                                        <td>
                                            <button class="btn btn-success  dim" type="button">
                                                <i class="fa fa-upload"></i>
                                            </button>今日展示
                                        </td>
                                        <td><span style="color:#27C24C;">@ShowUserData.TodayShow</span></td>
                                        <td>
                                            <button class="btn btn-danger  dim " type="button">
                                                <i class="fa fa-heart"></i>
                                            </button>总展现量
                                        </td>
                                        <td><span style="color:#fb0931;">@ShowUserData.TotalShow</span></td>
                                    </tr>
                                    <tr>
                                        <td>
                                            <button class="btn btn-info  dim" type="button">
                                                <i class="fa fa-paste"></i>
                                            </button>今日点击
                                        </td>
                                        <td><span style="color:#0828fb;">@ShowUserData.TodayClick</span></td>
                                        <td></td>
                                        <td></td>
                                    </tr>
                                </tbody>
                            </table>
                        </div>
                    </div>
                </div>
            </div>
        </div>
    </div>

    <div class="row">
        <div class="col-sm-6">
            <div class="ibox float-e-margins">
                <div class="ibox-title">
                    <h5>折线图</h5>
                </div>
                <div class="ibox-content">
                    <div class="echarts" id="echarts-line-chart"></div>
                </div>
            </div>
        </div>
        <div class="col-sm-6">
            <div class="ibox float-e-margins">
                <div class="ibox-title">
                    <h5>柱状图</h5>
                </div>
                <div class="ibox-content">

                    <div class="echarts" id="echarts-bar-chart"></div>
                </div>
            </div>
        </div>
    </div>

</div>

<script>

    $(function () {

               ys.ajax({
                     url:  '@Url.Content("~/Home/GetEchartDataJson")',
                     type: "post",
                     success: function (obj) {
                         if (obj.Tag == 1) {
                               var lineChart = echarts.init(document.getElementById("echarts-line-chart"));
                                 lineChart.setOption(JSON.parse(obj.Data.LineData));
                                 $(window).resize(lineChart.resize);
                               var barChart = echarts.init(document.getElementById("echarts-bar-chart"));
                                  barChart.setOption(JSON.parse(obj.Data.BarData));
                                  window.onresize = barChart.resize;
                         }

                     }
                 });

          //var lineChart = echarts.init(document.getElementById("echarts-line-chart"));
          //var lineoption = {
          //    title: {
          //        text: '未来一周气温变化'
          //    },
          //    tooltip: {
          //        trigger: 'axis'
          //    },
          //    legend: {
          //        data: ['最高气温', '最低气温']
          //    },
          //    grid: {
          //        x: 40,
          //        x2: 40,
          //        y2: 24
          //    },
          //    calculable: true,
          //    xAxis: [
          //        {
          //            type: 'category',
          //            boundaryGap: false,
          //            data: ['周一', '周二', '周三', '周四', '周五', '周六', '周日']
          //        }
          //    ],
          //    yAxis: [
          //        {
          //            type: 'value',
          //            axisLabel: {
          //                formatter: '{value} °C'
          //            }
          //        }
          //    ],
          //    series: [
          //        {
          //            name: '最高气温',
          //            type: 'line',
          //            data: [11, 11, 15, 13, 12, 13, 10],
          //            markPoint: {
          //                data: [
          //                    { type: 'max', name: '最大值' },
          //                    { type: 'min', name: '最小值' }
          //                ]
          //            },
          //            markLine: {
          //                data: [
          //                    { type: 'average', name: '平均值' }
          //                ]
          //            }
          //        },
          //        {
          //            name: '最低气温',
          //            type: 'line',
          //            data: [1, -2, 2, 5, 3, 2, 0],
          //            markPoint: {
          //                data: [
          //                    { name: '周最低', value: -2, xAxis: 1, yAxis: -1.5 }
          //                ]
          //            },
          //            markLine: {
          //                data: [
          //                    { type: 'average', name: '平均值' }
          //                ]
          //            }
          //        }
          //    ]
          //};
          //lineChart.setOption(lineoption);
          //$(window).resize(lineChart.resize);

          //var barChart = echarts.init(document.getElementById("echarts-bar-chart"));
          //var baroption = {
          //    title: {
          //        text: '某地区蒸发量和降水量'
          //    },
          //    tooltip: {
          //        trigger: 'axis'
          //    },
          //    legend: {
          //        data: ['蒸发量', '降水量']
          //    },
          //    grid: {
          //        x: 30,
          //        x2: 40,
          //        y2: 24
          //    },
          //    calculable: true,
          //    xAxis: [
          //        {
          //            type: 'category',
          //            data: ['1月', '2月', '3月', '4月', '5月', '6月', '7月', '8月', '9月', '10月', '11月', '12月']
          //        }
          //    ],
          //    yAxis: [
          //        {
          //            type: 'value'
          //        }
          //    ],
          //    series: [
          //        {
          //            name: '蒸发量',
          //            type: 'bar',
          //            data: [2.0, 4.9, 7.0, 23.2, 25.6, 76.7, 135.6, 162.2, 32.6, 20.0, 6.4, 3.3],
          //            markPoint: {
          //                data: [
          //                    { type: 'max', name: '最大值' },
          //                    { type: 'min', name: '最小值' }
          //                ]
          //            },
          //            markLine: {
          //                data: [
          //                    { type: 'average', name: '平均值' }
          //                ]
          //            }
          //        },
          //        {
          //            name: '降水量',
          //            type: 'bar',
          //            data: [2.6, 5.9, 9.0, 26.4, 28.7, 70.7, 175.6, 182.2, 48.7, 18.8, 6.0, 2.3],
          //            markPoint: {
          //                data: [
          //                    { name: '年最高', value: 182.2, xAxis: 7, yAxis: 183, symbolSize: 18 },
          //                    { name: '年最低', value: 2.3, xAxis: 11, yAxis: 3 }
          //                ]
          //            },
          //            markLine: {
          //                data: [
          //                    { type: 'average', name: '平均值' }
          //                ]
          //            }
          //        }
          //    ]
          //};
          //barChart.setOption(baroption);

          //window.onresize = barChart.resize;
          });

</script>
